<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>zc-webrtc</title>
<style>
video {
    width: 640px;
    height: 360px;
    border: 1px solid red;
}
</style>
</head>
<body>
<div>
    <p>你的视频</p>
    <video autoplay controls="controls" id="your"></video>
</div>
<div>
    <p>对方视频</p>
    <video autoplay controls="controls" id="other"></video>
</div>
<canvas id="canvas" style="display:none;"></canvas>
<div>
    请选择帧数
    <select id="rate">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
        <option value="6">6</option>
        <option value="7">7</option>
        <option value="8">8</option>
        <option value="9">9</option>
        <option value="10">10</option>
        <option value="11">11</option>
        <option value="12" selected>12</option>
        <option value="13">13</option>
        <option value="14">14</option>
        <option value="15">15</option>
        <option value="16">16</option>
        <option value="17">17</option>
        <option value="18">18</option>
        <option value="19">19</option>
        <option value="20">20</option>
        <option value="21">21</option>
        <option value="22">22</option>
        <option value="23">23</option>
        <option value="24">24</option>
        <option value="25">25</option>
    </select>
    请选择分辨率
    <select id="resolution">
        <option value="640*360">640*360</option>
        <option value="640*480">640*480</option>
        <option value="1280*720" selected>1280*720</option>
    </select>
</div>
<br>
<div>
    <input type="text" id="yourUsername"/>
    <button id="login">登录</button>
    <input type="text" id="otherUsername"/>
    <button id="call">呼叫</button>
    <button id="leave">离开</button>
    <br>
    <input type="checkbox" id="viewer">不传输自己的视频
    <input type="checkbox" id="showSelf" checked>不显示自己的视频
</div>
<script src="client.js"></script>
</body>
</html>
